<%@ page contentType="text/html; charset=UTF-8" language="java"%>
<%@ page 
	import="java.io.*,
			java.util.*" %> <head>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
    <title>Google地图</title>
	<%@ include file="googlemap_include.jsp"%>
    <script type="text/javascript">
   
    
    function TextualZoomControl() {
    }
    TextualZoomControl.prototype = new GControl();


    TextualZoomControl.prototype.initialize = function(map) {
      var container = document.createElement("div");

      var zoomInDiv = document.createElement("div");
	  //zoomInDiv.style.font="small Arial 1em";

      this.setButtonStyle_(zoomInDiv);
      container.appendChild(zoomInDiv);
      zoomInDiv.appendChild(document.createTextNode("地图"));
      GEvent.addDomListener(zoomInDiv, "click", function() {
	 	map.setMapType(G_NORMAL_MAP);
        
      });

      var zoomOutDiv = document.createElement("div");
      this.setButtonStyle_(zoomOutDiv);
      container.appendChild(zoomOutDiv);
      zoomOutDiv.appendChild(document.createTextNode("地形地图"));
      GEvent.addDomListener(zoomOutDiv, "click", function() {
	  	map.setMapType(G_PHYSICAL_MAP);
        
      });

      map.getContainer().appendChild(container);
      return container;
    }

    TextualZoomControl.prototype.getDefaultPosition = function() {
      return new GControlPosition(G_ANCHOR_TOP_RIGHT, new GSize(7, 7));
    }

    TextualZoomControl.prototype.setButtonStyle_ = function(button) {
      button.style.textDecoration = "underline";
      button.style.color = "#0000cc";
      button.style.backgroundColor = "white";
      button.style.font = "small-caps   9pt   serif";
	 
      button.style.border = "1px solid black";
      button.style.padding = "2px";
      button.style.marginBottom = "3px";
      button.style.textAlign = "center";
      button.style.width = "5em";
      button.style.cursor = "pointer";
    }

    var map = null;
    var geocoder = null;
	var baseIcon=null;
    function initialize() {
      if (GBrowserIsCompatible()) {
	  
        map = new GMap2(document.getElementById("map_canvas"));
		map.addControl(new GSmallMapControl());
		map.addControl(new GMapTypeControl()); 
		map.addControl(new GOverviewMapControl());
     	map.enableDoubleClickZoom();
     	map.enableScrollWheelZoom();
     	map.enableContinuousZoom(); //
		//shao guan is (24.996016,113.59314).
        map.setCenter(new GLatLng(24.816498,113.597088), 14);
		map.addControl(new TextualZoomControl());

		baseIcon = new GIcon();
        baseIcon.shadow = "http://www.google.com/mapfiles/shadow50.png";
        baseIcon.iconSize = new GSize(20, 34);
        baseIcon.shadowSize = new GSize(37, 34);
        baseIcon.iconAnchor = new GPoint(9, 34);
        baseIcon.infoWindowAnchor = new GPoint(9, 2);
        baseIcon.infoShadowAnchor = new GPoint(18, 25);
		var icon1 = new GIcon();
		icon1.image="http://www.bipub.org/images/GoogleMapsIcons/icong1.png";
		icon1.shadow = "http://www.google.com/mapfiles/shadow50.png";
		icon1.shadowSize = new GSize(21, 29);
		icon1.iconAnchor = new GPoint(10, 30);
		icon1.infoWindowAnchor = new GPoint(9, 5);
		icon1.infoShadowAnchor = new GPoint(9, 5);
			

        geocoder = new GClientGeocoder();
		showAddress("韶关",icon1);
		var point = new GLatLng(24.814413776148065,113.59066128730774);
		map.addOverlay(createMarker(point,1,'中国移动通信武江北服务厅'));
		
		point = new GLatLng(24.80605806454742,113.59894394874573);
		map.addOverlay(createMarker(point,1,'中国移动通信风度服务厅'));
		
		point = new GLatLng(24.80020483553627,113.56907486915588);

		map.addOverlay(createMarker(point,2,'中国移动通信（工业西路）'));
		
		

		
      }
    }

    function showAddress(address,icon) {
      if (geocoder) {
        geocoder.getLatLng(
          address,
          function(point) {
            if (!point) {
              alert(address + " not found");
            } else {
              //map.setCenter(point, 6);
			  //GLog.write(address);
              var marker = new GMarker(point,icon);
              map.addOverlay(marker);
              marker.openInfoWindowHtml(address);
            }
          }
        )
      }
    }
	
	function createMarker(point, imageName,html) {
          // Create a lettered icon for this point using our icon class
          
          var letteredIcon = new GIcon(baseIcon);
          letteredIcon.image = "http://www.bipub.org/images/GoogleMapsIcons/icong"+imageName+".png";

          // 设置 GMarkerOptions 对象
          markerOptions = { icon:letteredIcon };
          var marker = new GMarker(point, markerOptions);

          GEvent.addListener(marker, "click", function() {
            marker.openInfoWindowHtml("标记  <b>" + html + "</b>");
          });
          return marker;
        }
		
    </script>
  </head>

  <body onLoad="initialize()" onUnload="GUnload()">
 
</div>
<%@ include file="googlemap_include2.jsp"%>
  
  </body>